.settings-page {
  padding: 20px;
  animation: slideInUp 0.6s ease-out;
}

@keyframes slideInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.page-header {
  margin-bottom: 24px;
}

.page-header .arco-typography-h3 {
  margin: 0;
  font-weight: 600;
  color: var(--color-text-1);
}

.settings-content {
  max-width: 800px;
}

.settings-card {
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-1);
  background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%);
  border: 1px solid var(--color-border-1);
}

.settings-card .arco-card-body {
  padding: 32px;
}

.arco-form-item {
  margin-bottom: 24px;
}

.arco-form-item-label {
  font-weight: 600;
  color: var(--color-text-1);
  margin-bottom: 8px;
}

/* 输入框样式优化 */
.arco-input-wrapper,
.arco-select-view {
  border-radius: var(--border-radius-md);
  background-color: var(--color-bg-2);
  border: 1px solid var(--color-border-1);
}

.arco-input-wrapper:hover,
.arco-select-view:hover {
  border-color: var(--color-primary);
}

.arco-input-wrapper.arco-input-focus,
.arco-select-view.arco-select-focused {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgba(22, 93, 255, 0.2);
}

/* 文本域样式优化 */
.arco-textarea-wrapper {
  border-radius: var(--border-radius-md);
  background-color: var(--color-bg-2);
  border: 1px solid var(--color-border-1);
}

.arco-textarea-wrapper:hover {
  border-color: var(--color-primary);
}

.arco-textarea-wrapper.arco-textarea-focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgba(22, 93, 255, 0.2);
}

/* 开关样式优化 */
.arco-switch {
  background-color: var(--color-border-2);
}

.arco-switch-checked {
  background-color: var(--color-primary);
}

/* 按钮样式优化 */
.arco-btn-primary {
  margin-top: 16px;
  padding: 0 24px;
  height: 40px;
  border-radius: var(--border-radius-md);
  background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
  border: none;
  font-weight: 500;
  color: white;
  box-shadow: 0 2px 4px rgba(22, 93, 255, 0.3);
}

.arco-btn-primary:hover {
  background: linear-gradient(90deg, var(--color-primary-hover) 0%, #5a8fff 100%);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(22, 93, 255, 0.4);
}

.arco-btn-primary:active {
  transform: translateY(0);
}

.arco-btn-primary:focus {
  box-shadow: 0 0 0 2px rgba(22, 93, 255, 0.2);
}

.arco-divider-horizontal {
  margin: 32px 0;
  border-top-color: var(--color-border-1);
}

/* 图标样式优化 */
.settings-card .arco-icon {
  color: var(--color-primary);
}